<!-- 知识库平台 - 双优化案例库 from 设计需求申请 -->
<template>
  <base-breadcrumb>
    <searchData :empty="true" emptyField="opDetailType" :searchData="searchArr" @search="search" @changeSelect="onChangeSelect"></searchData>
    <a-card :bordered="false" style="over-flow:scroll">
      <list-table
        ref="table"
        :request="loadData"
        :columns="columns"
        :statistics-config="{ use: true, statistics, temp }"
        :exportConfig="{ use: true, select: '双优化案例库', all: '双优化案例库', customColumns: columnsExport }"
        :is-init="false"
        :exportPermission="{ select: 'ds_041_exp_04', all: 'ds_041_exp_04' }"
      >
        <span slot="serial" slot-scope="text, record, index">{{ index + 1 }}</span>
        <div slot="actions" slot-scope="text, record">
          <MoreButton>
            <a @click="handleLook(record)" v-btnPermission="'ds_041_loo_01'">查看</a>
            <a @click="handleDel(record)" v-btnPermission="'ds_041_del_02'">删除</a>
            <BasePrintButton class="_print" v-btnPermission="'ds_041_pri_03'" buttonType="a" :showDivider="false" :beforePrintFn="() => beforePrintFn(record)" />
          </MoreButton>
        </div>
      </list-table>
    </a-card>
  </base-breadcrumb>
</template>

<script>
import { knowledgeOptimizePrint, knowledgeOptimizeList, knowledgeOptimizeDel } from '@/api/design/knowledgeBase/optimization'
import { categoryList } from '@/api/technical/optimizationPlan'

const columns = [
  {
    title: '序号',
    width: '65px',
    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '双优化立项名称',
    dataIndex: 'planName'
  },
  {
    title: '优化类型',
    dataIndex: 'category'
  },
  {
    title: '详细分类',
    dataIndex: 'opDetailType'
  },
  {
    title: '分部',
    dataIndex: 'part'
  },
  {
    title: '使用部位',
    dataIndex: 'useSite'
  },
  {
    title: '操作',
    dataIndex: 'actions',
    fixed: 'right',
    width: 200,
    scopedSlots: { customRender: 'actions' }
  }
]

const columnsExport = [
  {
    title: '序号',
    width: '65px',
    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '双优化立项名称',
    dataIndex: 'planName'
  },
  {
    title: '优化类型',
    dataIndex: 'category'
  },
  {
    title: '详细分类',
    dataIndex: 'opDetailType'
  },
  {
    title: '分部',
    dataIndex: 'part'
  },
  {
    title: '使用部位',
    dataIndex: 'useSite'
  },
  {
    title: '优化背景',
    dataIndex: 'optimizationBackground'
  },
  {
    title: '优化理由',
    dataIndex: 'optimizationRationale'
  },
  {
    title: '适用范围',
    dataIndex: 'applicationScope'
  },
  {
    title: '使用提示',
    dataIndex: 'usingTips'
  },
]

export default {
  name: 'KnowledgeBaseOptimization',
  components: {},
  data() {
    this.columns = columns
    return {
      columnsExport,
      beforePrintFn: async record => {
        let res = await knowledgeOptimizePrint({ templateCode: 'CSCEC8XN-TD-B20018', businessId: record.caseId })
        return res.data.content
      },
      // 查询参数
      queryParam: {},
      form: {
        name: '',
        status: ''
      },
      // 查询条件
      searchArr: [
        {
          name: '双优化立项名称',
          value: 'planName',
          type: 'input'
        },
        {
          name: '优化类型',
          value: 'category',
          type: 'select',
          data: []
        },
        {
          name: '详细分类',
          value: 'opDetailType',
          type: 'select',
          data: []
        },
        {
          name: '分部',
          value: 'part',
          type: 'input'
        }
      ],
      // 表格上的统计区
      statistics: {},
      // 统计区渲染内容
      temp: () => {
        return <span style="margin-right: 12px"></span>
      }
    }
  },
  mounted() {
    // 获取【优化类型】及【详细分类】
    this.getCategoryList()
    this.$refs.table.refresh()
    // this.$nextTick(() => {
    //   if (this.isFirst) {
    //     this.isFirst = false
    //   }
    // })
  },
  // activated() {
  //   if (!this.isFirst) {
  //     this.$refs.table.refresh()
  //   }
  // },
  methods: {
    loadData(parameter) {
      const requestParameters = Object.assign({}, parameter, this.queryParam)
      return knowledgeOptimizeList(requestParameters)
    },
    // 获取【优化类型】及【详细分类】
    getCategoryList() {
      categoryList().then(res => {
        const o = this.searchArr.find(item => item.name === '优化类型')
        o.data = res.data.map(item => ({ ...item, label: item.name, value: item.id }))
      })
    },
    // 搜索
    search(values) {
      this.queryParam = values
      this.$refs.table.refresh(true)
    },
    // 切换选择框触发
    onChangeSelect(val, item) {
      // 切换【优化类型】时
      if (item.name !== '优化类型') return
      const opDetailTypeObj = this.searchArr.find(item => item.name === '详细分类')

      if (val) {
        const o = item.data.find(item => item.id === val)
        if (!o) return
        opDetailTypeObj.data = o.children.map(item => ({ ...item, label: item.name, value: item.id }))
        return
      }
      opDetailTypeObj.data = []
    },
    // 表单行 - 查看
    handleLook(record) {
      this.$router.push({
        path: '/project/design/knowledgeBase/optimization/detail',
        query: {
          caseId: record.caseId
        }
      })
    },
    // 表单行 - 删除
    handleDel(record) {
      this.$confirm({
        title: '温馨提示',
        content: `请确认是否要删除数据？`,
        okText: '确认',
        okType: 'danger',
        cancelText: '取消',
        onOk: () => {
          knowledgeOptimizeDel({ caseId: record.caseId }).then(res => {
            if (res.data.code === 200) {
              this.$message.success('删除成功')
              this.$refs.table.getData(null, true)
              return
            }
            this.$message.warning(res.data.message)
          })
        }
      })
    }
  }
}
</script>

<style scoped lang="less">
._print {
  /deep/a {
    padding: 0 !important;
  }
}
</style>
